<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <title>详情列表</title>
    <link rel="stylesheet" href="../css/bootstrap-3.3.7-dist/css/bootstrap.css">
    <link rel="stylesheet" href="../css/footer.css">
    <link rel="stylesheet" href="../css/header.css">
    <script src="../js/jquery-1.12.3.min.js"></script>
    <script src="../js/public.js"></script>
    <link rel="stylesheet" href="../css/SecondHandList.css">
    <script src="../js/SecondHandList.js"></script>

</head>
<body>
<!--*******************引入头部************************-->
<header id="header" >
    <div class="icon" >
        <div id="logo"><img src="../img/index/logo.png"/></div>
        <div id="my"><img class="" src="../img/index/my.png"/></div>
        <div id="xiazai"><img class="" src="../img/index/xiazai.png"/></div>
    </div>
</header>
<!--********搜索框***********-->
<div id="main">
    <div id="input" class="input-group">
        <input type="text" class="form-control" placeholder="请输入小区或商圈名！">
    </div>
</div>

<!--*************选项列表***************-->
<div id="zhe"></div>
<div id="navList">
    <ul>
        <li>区域 <span class="caret"></span></li>
        <li>价格 <span class="caret"></span></li>
        <li>房型 <span class="caret"></span></li>
        <li>更多 <span class="caret"></span></li>
    </ul>

<!--*******区域部分*******-->
    <div id="showList">
        <div style="display: none" id="district" >
<ul>
<li>
    <div id="dis_left" style="background-color: #f0f0f0;height: 100%">
        <ul >
            <li style="color: #ff8a00;background-color: white;">区域</li>
            <li>地铁</li>
        </ul>
    </div>
</li>
<li>
    <div id="dis_ccenter">
        <ul>
            <li>附近</li>
            <li >不限</li>
            <li style="color: #ff8a00;">朝阳</li>
            <li>海淀</li>
            <li>昌平</li>
            <li>丰台</li>
            <li>石景山</li>
        </ul>
    </div>
</li>
<li>
    <div id="dis_right">
        <ul>
            <li style="color: #ff8a00;">不限</li>
            <li>安贞</li>
            <li>奥林匹克公园</li>
            <li>百子湾</li>
            <li>北工大</li>
            <li>北苑</li>
            <li>CBD</li>
        </ul>
    </div>
</li>
<!--<li></li>-->
</ul>
</div>
<!--*******价格部分*****-->
        <div style="display: none" id="price">
            <ul>
                <li>不限</li>
                <li>100万以下</li>
                <li>100万-150万</li>
                <li>150万-200万</li>
                <li>200万-250万</li>
                <li>250万-300万</li>
                <li>自定义价格 <span>最大</span> - <span>最大</span> <span>确定</span></li>
            </ul>
        </div>
<!--*******房型部分*****-->
        <div style="display: none" id="houType">
<ul>
<li>不限 </li>
<li>1室 <p><input type="checkbox"></p></li>
<li>2室 <p><input type="checkbox"></p></li>
<li>3室 <p><input type="checkbox"></p></li>
<li>4室 <p><input type="checkbox"></p></li>
<li>5室 <p><input type="checkbox"></p></li>
</ul>
</div>
<!--*******更多部分*****-->
        <div style="display:none " id="more">
    <ul>
        <li>
            <h4>区域</h4>
            <ul>
                <li>南</li>
                <li>南北</li>
                <li>东西</li>
                <li>东</li>
                <li>北</li>
            </ul>
        </li>
        <li>
            <h4>面积（平方米）</h4>
            <ul>
                <li>50以下</li>
                <li>50-70</li>
                <li>70-90</li>
                <li>90-110</li>
                <li>110-130</li>
                <li>130-150</li>
                <li>150-200</li>
                <li>200以上</li>
            </ul>
        </li>
        <li>
            <h4>标签</h4>
            <ul>
                <li>学区房</li>
                <li>地铁房</li>
                <li>不限购</li>
                <li>满两年</li>
                <li>满五唯一</li>
                <li>新上架</li>
                <li>降价/li>
                <li>独家</li>
                <li>有钥匙</li>
            </ul>
        </li>
        <li>
            <h4>楼龄</h4>
            <ul>
                <li>5年以内</li>
                <li>10年以内</li>
                <li>20年以内</li>
                <li>20年以上</li>
            </ul>
        </li>
        <li>
            <h4>楼层</h4>
            <ul>
                <li>低楼层</li>
                <li>中楼层</li>
                <li>高楼层</li>
            </ul>
        </li>
        <li>
            <h3>清空条件</h3>
            <h3>确定</h3>
        </li>
    </ul>
</div>

    </div>
</div>
<!--***************房源列表部分************-->
<div id="houseList" class="media">
    <ul>
        <li>
            <div class="media-left">
                <img  src="../img/SecondHandList/img1.png"/>
            </div>
            <div class="media-body">
                <div>
                    <h2>西便门外大街 2室1厅 89平</h2>
                </div>
                <div>
                    <h4>南北 高楼层/6层</h4>
                </div>
                <div class="des1">
                    <p>签约价格：13244元/平</p>
                    <p class="des1_right">1105万</p>
                </div>
                <div class="des2">
                    <p>签约日期：2015年11月10日</p>
                </div>
            </div>
        </li>
        <li>
            <div class="media-left">
                <img  src="../img/SecondHandList/img2.png"/>
            </div>
            <div class="media-body">
                <div>
                    <h2>金桥国际 1室1厅 63平</h2>
                </div>
                <div>
                    <h4>南北 高楼层/6层</h4>
                </div>
                <div class="des1">
                    <p>签约价格：13244元/平</p>
                    <p class="des1_right">950万</p>
                </div>
                <div class="des2">
                    <p>签约日期：2015年11月10日</p>
                </div>
            </div>
        </li>
        <li>
            <div class="media-left">
                <img  src="../img/SecondHandList/img3.png"/>
            </div>
            <div class="media-body">
                <div>
                    <h2>花涧溪二期 2室2厅 90平</h2>
                </div>
                <div>
                    <h4>南北 高楼层/6层</h4>
                </div>
                <div class="des1">
                    <p>签约价格：13244元/平</p>
                    <p class="des1_right">1322万</p>
                </div>
                <div class="des2">
                    <p>签约日期：2015年11月10日</p>
                </div>
            </div>
        </li>
    </ul>
</div>

<!--********************引入尾部**************************-->
<footer >
    <div id="foot_content">
        <h3>北京找房无忧 > 首页</h3>
        <div id="phone">
            <ul>
                <li>
                    <div class="media-left">
                        <img src="../img/index/apple.png" />
                    </div>
                    <div class="media-body">
                        <p>iPhone</p>
                        <p>客户端</p>
                    </div>
                </li>
                <li>
                    <div class="media-left">
                        <img src="../img/index/android.png" />
                    </div>
                    <div class="media-body">
                        <p>Android</p>
                        <p>客户端</p>
                    </div>
                </li>
            </ul>
        </div>
        <div id="copy">
            <p>北京找房无忧房地产经纪公司</p>
            <p>网络经营许可证京ICP备20160812号</p>
        </div>
    </div>
</footer>

<script>
    $(function(){
        setRem();
        $(function(){
            $(window).bind("resize",function(){
                setRem();
            })
        });
    })
    $("#navList>ul>li").click(function(){
        active($(this))
    })
    $("#zhe").click(function(){
        body();
    })
</script>
</body>
</html>